<template>
    <view class="article">
        <view style="height: 20rpx"></view>
        <block v-for="(item, index) in articleList" :key="index">
            <view class="article-item" @click="godetail(item.id)">
                <view class="article-left"
                    ><image style="border-radius: 8rpx; width: 256rpx; height: 180rpx" :src="item.coverAbsolute"></image
                ></view>
                <view class="article-right">{{ item.title }}</view>
            </view>
        </block>
        <u-loadmore
            v-if="more"
            :status="status"
            loadingText="加载中"
            loadmoreText="上拉加载更多"
            nomoreText="已经到底啦～"
            fontSize="28"
            iconSize="30"
            marginTop="20"
            marginBottom="30"
        ></u-loadmore>

        <my-empty
            src="https://smosun-minapp.oss-cn-shanghai.aliyuncs.com/weapp/img/home/artempty.png"
            text="暂无知识内容"
            v-if="articleList.length == 0 && isloading == false"
        ></my-empty>
    </view>
</template>

<script>
export default {
    data() {
        return {
            articleList: [],
            pageNum: 1,
            pageSize: 20,
            isloading: false,
            total: 0,
            status: 'loadmore',
            more: false,
        };
    },
    onLoad() {
        this.goarticlelist(true);
    },
    onPullDownRefresh() {
        this.goarticlelist(true);
    },
    onReachBottom() {
        if (this.more == false) return;
        this.status = 'loading';
        this.pageNum = ++this.pageNum;
        this.goarticlelist(false);
    },
    methods: {
        goarticlelist(isFresh) {
            if (isFresh) {
                this.pageNum = 1;
                this.pageSize = 20;
                this.isloading = true;
            }
            let data = {
                pageNum: this.pageNum,
                pageSize: this.pageSize,
                isAsc: 'descending',
                orderByColumn: 'orderNum desc,updateTime',
            };
            this.request.httpTokenRequest('/mp-api/wx/article/list', data, 'POST', true).then((res) => {
                uni.stopPullDownRefresh();
                this.isloading = false;
                if (res.code == 0) {
                    if (res.data.list && isFresh) {
                        this.articleList = res.data.list;
                    } else {
                        res.data.list.forEach((item) => {
                            this.articleList.push(item);
                        });
                    }
                    if (res.data.total > this.articleList.length) {
                        this.status = 'loadmore';
                        this.more = true;
                    } else {
                        this.more = false;
                        this.status = 'nomore';
                    }
                } else {
                    this.more = false;
                    this.status = 'nomore';
                }
            });
        },
        godetail(id) {
            uni.navigateTo({
                url: '/packageHome/pages/article/detail?id=' + id,
            });
        },
    },
};
</script>
